/**
 * Class Item
 * This class manipulate html created from template and element created by tag for item
 * Example:
 *  var item = new Item({name: "text"}, "template-id", "li");
 * or
 *  var item = new Item(); // -> is empty "li" element
 *  item.setTag("div"); // -> now we change to "div" element
 *  item.setTemplate("template-id");
 *  item.setData({name: "test"}); // -> generaget html form template
 *      //and data is appended to this "div" element
 *  item.setOnClickListener(function(){
 *      //this -> item instance
 *  });
 */
Item = (function(_super) {

    __extends(Item, _super);
    /**
     * Item constructor
     * @param [data] {Object} data for item
     * @param [templateid] {String} template or template id for this item
     * @param [tag] {String} html tag fot this item "li" by default
     * @constructor
     */
    function Item(data, templateid, tag) {
        Item.__super__.constructor.call(this);
        this.setTag(tag);
        this.setTemplate(templateid);
        this.setData(data);
    }
    /**
     * Set Tag name and create content view
     * @param [tag] {String} html tag fot this item "li" by default
     */
    Item.prototype.setTag = function(tag){
        this.tag = "li" || tag;
        this.setContentView(document.createElement(this.tag));
    };
    /**
     * Set Javascript Template for item
     * @param [templateid] {String} template or template id for this item
     */
    Item.prototype.setTemplate = function(templateid){
        this.templateID = templateid;
    };
    /**
     * Set Date and create html with template
     * @param data {Object} item data
     */
    Item.prototype.setData = function(data) {
		this.data = data;
		if(!this.templateID) return;
		this.template = new Template(this.templateID, data);
		this.view.html(this.template.getHTML());

        this.loadImages(this.view.selectAll('.image', true));
    };
    /**
     * Load Images crate Background image if we have image in template
     * (image is div or other element with css class "image")
     * @param images {[HTMLElement]} collection of HTMLElements
     */
    Item.prototype.loadImages = function(images){
        var _i, _image;
        if(!images || images.length == 0) return;

        for(_i = 0; _i < images.length; _i++){
            _image = new BackgroundImage(images[_i]);
        }
    };
    /**
     * Remove html item form html
     */
	Item.prototype.remove = function(){
		this.view.remove();
	};

    return Item;

})(Base);